<!DOCTYPE html>
<html lang="en">
	<head>
		<script src="./js/verificationScreen.js?v2020_5_5_1"></script>
		<link href="./img/favicon.ico" rel="shortcut icon" type="image/icon" />
		<meta charset="UTF-8" />
		<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0" /> -->
		<title>登录-码云</title>
	</head>
	<link rel="stylesheet" href="./style/index.css?v2020_5_5_2" />

	<body>
		<div class="loginPageBox">
			<main class="main">
				<div class="bodyBox">
					<!-- 左侧 随机人物评价 -->
					<div class="left randomBox">
						<img id="logo" src="./img/logo.svg" alt="logo" />
						<h2 class="title">云端软件开发协作平台</h2>
						<!-- 评价内容 -->
						<div class="content">
							<div class="row nameAndTag">
								<div class="name"></div>
								<div class="tag"></div>
							</div>
							<div class="row text"></div>
						</div>
						<a
							class="footer"
							href="https://gitee.com/enterprises?from=login"
							target="_blank"
						>
							<strong class="bold">码云企业版</strong>
							<span class="connector">-</span>
							企业级软件协作开发管理平台
							<span class="iconArrowRight">›</span>
						</a>
					</div>
					<!-- 右侧登录 注册 -->
					<div class="right loginBox">
						<!-- 登录分支 -->
						<div class="loginBranch">
							<div class="row spaceBetween header">
								<div class="title">登录</div>
								<div class="subTitle">
									没有帐号？<a
										href="#/signup"
										class="changeRouter"
										>点此注册</a
									>
								</div>
							</div>
							<div class="row loginError">帐号或者密码错误</div>
							<!-- 普通登录 -->
							<div class="normalLogin">
								<div class="row ">
									<div class="userNameBox">
										<input
											id="userName"
											type="text"
											name="userName"
											placeholder="手机／邮箱／个人空间地址"
											autocomplete="off"
										/>
										<div class="errorInfo userName"></div>
									</div>
								</div>
								<div class="row">
									<div class="passwordBox	">
										<input
											id="password"
											type="password"
											name="userPassword"
											placeholder="请输入密码"
											maxlength="32"
											autocomplete="off"
										/>
										<div class="errorInfo"></div>
									</div>
								</div>
							</div>
							<!-- 短信登录 -->
							<div class="shortmessageLogin">
								<div class="row ">
									<div class="">
										<input
											id="shortmessagePhone"
											type="text"
											placeholder="手机号码"
											maxlength="11"
											autocomplete="off"
										/>
										<div class="errorInfo"></div>
									</div>
								</div>
								<div class="row">
									<div class="vCodeBox">
										<div class="vCodeBoxBody">
											<input
												id="vCode"
												type="text"
												name="vCode"
												disabled
												placeholder="手机验证码"
												maxlength="6"
												autocomplete="off"
											/>
											<div
												id="sendVcode"
												class="sendVcode"
											>
												发送验证码
											</div>
											<div class="help">
												收不到验证码?
												<a
													href="https://gitee.com/self_services"
													target="_blank"
													>获取帮助</a
												>
											</div>
										</div>
										<div class="errorInfo"></div>
									</div>
								</div>
							</div>
							<div
								class="row spaceBetween rememberAndShortmessage"
							>
								<div class="left">
									<input
										type="checkbox"
										id="remember"
										value="记住我"
									/>
									<label class="rememberLabel" for="remember">
										<div class="checkboxUi"></div>
										记住我
									</label>
								</div>
								<!-- 两个路由切换按钮 -->
								<a
									href="#/shortmessage"
									class="right shortmessageSignup changeShortmessageLogin"
									>短信验证登录</a
								>
								<a href="#/" class="right changeNormalLogin"
									>用户名密码登录</a
								>
							</div>
							<div class="row">
								<button id="submitLogin" class="submit">
									登 录
								</button>
							</div>
						</div>
						<!-- 登录分支 end -->
						<!-- 注册分支 -->
						<div class="signupBranch">
							<div class="row spaceBetween header">
								<div class="title">注册</div>
								<div class="subTitle">
									已有帐号？<a href="#/" class="changeRouter"
										>点此登录</a
									>
								</div>
							</div>
							<div class="ignupRow">
								<div class="nameBox">
									<input
										id="signupName"
										type="text"
										name="dad_a"
										placeholder="姓 名"
										required="required"
										maxlength="6"
										autocomplete="off"
									/>
									<div class="errorInfo"></div>
								</div>
							</div>
							<div class="ignupRow">
								<div class="userDomainBox">
									<div class="leftLabel">
										https://gitee.com/
									</div>
									<input
										id="signupDomain"
										type="text"
										placeholder="个人空间地址"
										autocomplete="off"
									/>
									<div class="questionIcon">
										<div class="questionIconTootip">
											<div class="item">
												这是您注册帐号主页的地址，可用作推拉代码或登录码云的用户名
											</div>
											<div class="item">
												个人空间地址
												是用户在码云上的唯一标识，在开通码云帐号时填写
											</div>
											<div class="item">
												您可以将个人空间地址分享给朋友，让他们通过您的个人空间地址访问您的码云主页
											</div>
											<div class="item">
												每个帐号只能对应一个个人空间地址，建议您在注册时为您的帐号精心起一个好名字
											</div>
										</div>
									</div>
								</div>
								<div class="errorInfo"></div>
							</div>
							<!-- 手机或邮箱 -->
							<div class="ignupRow">
								<div class="phoneEmailBox">
									<input
										id="phoneEmail"
										type="text"
										name="dad_a1"
										placeholder="手机 或  邮 箱"
										autocomplete="off"
									/>
									<div class="errorInfo"></div>
								</div>
							</div>
							<!-- 发送验证码 -->
							<div class="ignupRow">
								<div class="vCodeBox">
									<div class="vCodeBoxBody">
										<input
											id="signupVCode"
											type="text"
											name="vCode"
											disabled
											placeholder="手机验证码"
											maxlength="6"
											autocomplete="off"
										/>
										<div
											id="signupSendVcode"
											class="sendVcode"
										>
											发送验证码
										</div>
										<div class="help">
											收不到验证码?
											<a
												href="https://gitee.com/self_services"
												target="_blank"
												>获取帮助</a
											>
										</div>
									</div>
									<div class="errorInfo"></div>
								</div>
							</div>
							<!-- 密码 -->
							<div class="ignupRow">
								<div class="passwordBox">
									<input
										id="signupPassword"
										type="password"
										placeholder="密码不少于6位"
										autocomplete="off"
									/>
									<div class="errorInfo"></div>
								</div>
								<div class="eyeIcon"></div>
							</div>
							<div class="ignupRow">
								<div class="left">
									<input
										type="checkbox"
										id="agree"
										value="我已阅读并同意"
									/>
									<label class="agreeLabel" for="agree">
										<div class="checkboxUi"></div>
										我已阅读并同意
										<a
											href="https://gitee.com/terms"
											target="_blank"
											>使用条款
										</a>
										及
										<a
											href="https://gitee.com/inactive_accounts"
											target="_blank"
											>非活跃帐号处理规范</a
										>
									</label>
									<div class="errorInfo"></div>
								</div>
								<!-- 两个路由切换按钮 -->
								<!-- <a
									href="#/shortmessage"
									class="right shortmessageSignup changeShortmessageLogin"
									>短信验证登录</a
								>
								<a href="#/" class="right changeNormalLogin"
									>用户名密码登录</a
								> -->
							</div>
							<div class="row">
								<button id="submitSignup" class="submit">
									立即注册
								</button>
							</div>
						</div>
						<a
							class="row forgetPassword"
							href="https://gitee.com/password/new"
							>已有账号，忘记密码?</a
						>
						<a
							class="row oschinaLogin"
							href="https://gitee.com/auth/oschina"
						>
							<img
								src="./img/oschina(1).png"
								class="logo"
								alt="开源中国"
							/>
							<span class="text">使用OSChina 帐号登录</span>
						</a>
						<div class="row otherLoginType">
							<div class="text">其他方式登录</div>
						</div>
						<div class="row otherLoginList">
							<img
								src="./img/wx.png"
								class="item logo"
								alt="微信"
							/>
							<img
								src="./img/QQ.png"
								class="item logo"
								alt="QQ"
							/>
							<img
								src="./img/github.png"
								class="item logo"
								alt="github"
							/>
							<div class="item more">
								<img
									src="./img/more.png"
									class="logo"
									alt="更多"
								/>
								<div class="moreListBox">
									<!-- 第一层防止hover移入后消失 -->
									<div class="moreList">
										<img
											src="./img/gitlab-hover.png"
											class="item logo"
											alt="gitlab"
										/>
										<img
											src="./img/钉钉.png"
											class="item logo"
											alt="钉钉"
										/>
										<img
											src="./img/阿里云.png"
											class="item logo"
											alt="阿里云"
										/>
										<img
											src="./img/微博.png"
											class="item logo"
											alt="微博"
										/>
										<img
											src="./img/windows_icon.png"
											class="item logo"
											alt="windowsLive"
										/>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="robot_vCodeBox">
						<h2 class="title">机器验证</h2>
						<img
							src="./img/rucaptcha.gif"
							class="codeImg"
							id="codeImg"
							alt="验证码"
						/>
						<input
							id="robotcode_input"
							type="text"
							name="code"
							placeholder="请输入上方图形验证码"
							maxlength="11"
							autocomplete="off"
						/>
						<div id="vCodeBtn" class="vCodeBtnInactive">验证</div>
						<div class="errorInfo"></div>
					</div>
				</div>
				<footer class="footer">
					<a href="https://gitee.com/" target="_blank"
						>© Gitee.com
					</a>
					<a href="https://gitee.com/about_us" target="_blank"
						>关于我们
					</a>
					<a href="https://gitee.com/terms" target="_blank"
						>使用条款</a
					>
					<a href="https://gitee.com/help" target="_blank"
						>帮助文档</a
					>
					<a href="https://gitee.com/self_services" target="_blank"
						>在线自助服务</a
					>
					<a href="https://gitee.com/user/activate" target="_blank"
						>重发激活邮件</a
					>
				</footer>
			</main>
		</div>
		<!-- mock数据 -->
		<script src="./js/mockData.js?v2020_5_5_1"></script>
		<!-- 工具 -->
		<script src="./js/tool.js?v2020_5_5_1"></script>
		<!-- 主js -->
		<script src="./js/index.js?v2020_5_5_1"></script>
		<script>
			window.onload = function() {
				// 路由
				router();
				// 设置随机评论
				setRandomComment();
				// 初始化表单相关
				// 登录
				loginFormInit();
				// 注册
				signupFormInit();

				// 监听哈希路由变化
				window.addEventListener("hashchange", e => {
					router();
					setRandomComment();
					pageStatus.hash = location.hash;
					console.log(location.hash);
					let newURL = e.newURL;
					let oldURL = e.oldURL;
					console.log(e);
				});
			};
		</script>
	</body>
</html>
